<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="./css/swiper-bundle.min.css">
	<link rel="stylesheet" href="css/index.css">
	<link rel="stylesheet" href="css/iconfont.css">
	<link rel="stylesheet" href="css/iconfont1.css">

</head>

<body>
	<div class="header">
		<div class="header_top">
			<div class="container clearfix">
				<div class="icon clearfix">
					<img src="./img/phone.png" alt="">
					<a href="">400-010-8888</a>
				</div>
				<div class="hello">
					<a href="">您好，欢迎来到中蜜丝路！</a>
				</div>
				<div class="vip clearfix">
					<div>
						<span>会员中心</span>
						<span>﹀</span>
						<ul class="dropdown-menu">
							<li><a href="./html/wdxx.html">我的信息</a></li>
							<li><a href="./html/wdry.html">我的认养</a></li>
							<li><a href="./html/fxdt.html">蜂箱动态</a></li>
							<li><a href="./html/ryxq.html">认养详情</a></li>
						</ul>
					</div>
				</div>
				<div class="span">
					<span>丨</span>
				</div>

				<div class="sign clearfix">
					<a href="./html/dl.html">
						<img src="./img/yonghu.png" alt="">
						<span>登录</span>
					</a>
				</div>
			</div>
		</div>
	</div>
	<div class="container clearfix nva">
		<div class="ZM">
			<a href="index.html">
				<img src="./img/logo.png" alt="">
			</a>
		</div>
		<ul class="clearfix">
			<li><a class="index" href="index.html">首页<span></span></a></li>
			<li><a href="./html/map.html">蜜源寻蜜</a></li>
			<li><a href="./html/hmkp.html">好蜜科普</a></li>
			<li><a href="./html/gjrz.html">蜂业专委会</a></li>
			<li><a href="./html/vadio.html">蜜蜂视界</a></li>
			<li><a href="./html/hyzx.html">会员中心</a></li>
		</ul>
	</div>
	<div class="banner">
		<div class="swiper-container">
			<div class="swiper-wrapper">
				<div class="swiper-slide"><img src="./img/temp/banner_1.jpg" alt=""></div>
				<div class="swiper-slide"><img src="./img/temp/banner_2.jpg" alt=""></div>
				<div class="swiper-slide"><img src="./img/temp/banner_1.jpg" alt=""></div>
				<div class="swiper-slide"><img src="./img/temp/banner_2.jpg" alt=""></div>
			</div>
			<div class="swiper-pagination"></div>
		</div>

	</div>
	<div class="certification-ico">
		<div class="container clearfix">
			<div class="inter">
				<h3 class="iconfont icon-tubiaoshangchuanmoban"></h3>
				<h2>国际标准</h2>
				<p>GB14963-2011</p>
				<p>食品安全国家标准</p>
			</div>
			<div class="craftsman">
				<h3 class="iconfont icon-renzheng"></h3>
				<h2>工匠认证</h2>
				<p>严格的认证步骤</p>
				<p>严谨的蜂农工匠体系</p>
			</div>
			<div class="lingdai">
				<h3 class="iconfont icon-lingdai-"></h3>
				<h2>专业培训</h2>
				<p>专业培训师</p>
				<p>科学及经验的传承</p>
			</div>
			<div class="g">
				<h3 class="iconfont icon-g"></h3>
				<h2>共享多赢</h2>
				<p>共享融合</p>
				<p>打造新金融现象</p>
			</div>
		</div>
	</div>
	<div class="advertising-box">
		<div class="container clearfix">
			<div class="advertising-left">
				<img src="./img/temp/index_03.jpg" alt="">
				<div class="advertising-div">
					<h1>蜜蜂视界</h1>
					<span></span>
					<p>BEES HORIZON</p>
					<a href="./html/vadio.html">观看视频</a>
				</div>
			</div>
			<div class="advertising-right clearfix">
				<div class="a-r-sharing">
					<img src="./img/temp/index_05.jpg" alt="">
					<div class="advertising-div">
						<h1>好蜜科普</h1>
						<span></span>
						<p>GOOD HONEY SCIENCE</p>
						<a href="./html/hmkp.html">了解更多</a>
					</div>
				</div>
				<div class="a-r-bee">
					<img src="./img/temp/index_07.jpg" alt="">
					<div class="advertising-div">
						<h1>蜂业专委会</h1>
						<span></span>
						<p>BEE INDUSTRY COMMITTEE</p>
						<a href="./html/gjrz.html">了解更多</a>
					</div>
				</div>
				<div class="a-r-honey">
					<img src="./img/temp/index_11.jpg" alt="">
					<div class="advertising-div">
						<h1>天然成熟原产地，打造最优质的蜂蜜</h1>
						<span></span>
						<p>NATURAL MATURE ORIGIN, TO CREATE THE BEST HONEY</p>
						<a href="./html/map.html">蜜源寻蜜</a>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="container honey-map ">
		<img src="img/temp/honey_title.png" class="honey-title">
		<div id="hot_map"> <img src="img/temp/point_bg.png" alt=""></div>
	</div>
	<div class="container yellow">
		<img src="./img/temp/inpro-banner.jpg" alt="">
	</div>
	<div class="container">
		<div class="majors-title">
			<a href="#">
				<img src="./img/temp/majors_title_bg.png" alt="">
				<p>We have a professional certification rating committee</p>
				<h1>我们有专业的专委会评级认证</h1>
			</a>
		</div>
	</div>
	<div class="container clearfix imgs">
		<ul class="relate">
			<li class="first">
				<img src="./img/temp/knowledge_01.jpg" alt="">
				<div></div>
			</li>
			<li>
				<img src="./img/temp/knowledge_02.jpg" alt="">
				<div></div>
			</li>
			<li>
				<img src="./img/temp/knowledge_03.jpg" alt="">
				<div></div>
			</li>
			<li>
				<img src="./img/temp/knowledge_04.jpg" alt="">
				<div></div>
			</li>
		</ul>
	</div>
	<div class="footer">
		<div class="container clearfix">
			<div class="foot-left">
				<ul>
					<li>
						<i class="iconfont 	icon-dianhua"></i>
						<span>400-010-8888</span>
					</li>
					<li>
						<i class="iconfont icon-shijianlishijilujishizhongbiaoxianxing"></i>
						<span>工作时间：8:30-17:30</span>
					</li>
					<li>
						<i class="iconfont icon-xinfeng"></i>
						<span>E-mail：contact@zhongmisilu.com</span>
					</li>
					<li>
						<i class="iconfont icon-weizhi"></i>
						<span>海南省海口市龙华区财富广场18C</span>
					</li>
				</ul>
			</div>
			<div class="line-foot"></div>
			<div class="foot-cen">
				<dl>
					<dt>
						<a href="">蜜源寻蜜</a>
					</dt>
				</dl>
				<dl>
					<dt><a href="">好蜜科普</a></dt>
					<dd>
						<a href="">蜜源探秘</a>
						<a href="">蜂蜜常识</a>
						<a href="">蜂蜜种类</a>
						<a href="">蜂蜜价值</a>
					</dd>
				</dl>
				<dl>
					<dt><a href="">蜂业专委会</a></dt>
					<dd>
						<a href="">工匠认证</a>
						<a href="">专业培训</a>
						<a href="">专委会介绍</a>
					</dd>
				</dl>
				<dl>
					<dt><a href="">蜜蜂视界</a></dt>
					<dd>
						<a href="">全部视频</a>
					</dd>
				</dl>
				<dl>
					<dt>
						<a href="">会员中心</a>
					</dt>
				</dl>
			</div>
			<div class="line-foot"></div>
			<div class="foot-rig">
				<dt>
					<img src="./img/temp/wx.jpg" alt="">
				</dt>
				<dd>
					扫描上方公众号微信二维码
					<br>
					或者微信加公众号：zhongmisilu
				</dd>
			</div>
		</div>
		<div class="copyright clearfix">© 2017 中蜜丝路 鲁公网安备 11010102002425号 鲁ICP证160503号 鲁ICP备14052685号-1
		</div>
	</div>



	<script type="text/javascript" src="./js/jquery-3.3.1.min.js"></script>
	<script src="./js/swiper-bundle.min.js"></script>
	<script src="./js/echarts.min.js"></script>
	<script src="./js/china.js"></script>

	<script>
		var swiper = new Swiper('.swiper-container', {
			loop: true,
			autoplay: {
				delay: 1000,//1秒切换一次
			},
			pagination: {
				el: '.swiper-pagination',
			},
		});
		
		var chart = echarts.init(document.getElementById('hot_map'));

		chart.setOption({
			tooltip: {
				trigger: 'item',
				backgroundColor: "#fcf6e1",
				borderColor: '#e94c2b',
				borderWidth: 1,
				padding: 10,
				textStyle: {
					color: "#333",
					width: 270
				},
				enterable: true,
				position: "right",
				formatter: function (params, ticket, callback) {
					return [
						"<div class='point-content'>"
						+ "<img src='" + params.data.url + "'>"
						+ "<h2>" + params.data.name + "</h2>"
						+ "<span>" + params.data.content + "</span>"
						+ "<a href='./html/map.html'>蜂箱认购</a>"
						+ " </div>"
					];
				}
			}, geo: {
				type: 'map',
				//map的值也是，省份汉语名称
				map: 'china',
				itemStyle: {
					normal: {
						areaColor: "#fcf6e1",
						borderColor: '#efe7ca'
					}, emphasis: {
						areaColor: "#fcf6e1",
						color: "#fcf6e1",
						borderColor: '#efe7ca'
					}
				},
				label: {
					emphasis: {
						show: false
					}
				}
			}, series: [{
				type: 'scatter',
				zlevel: 3,
				coordinateSystem: 'geo',
				blurSize: 20,
				markPoint: {
					zlevel: 8,
					symbol: "image://img/temp/point_bg.png",
					symbolSize: 60,
					symbolOffset: [0, -14],
					label: {
						normal: {
							show: true,
							position: 'bottom',
							formatter: '{b}',
							textStyle: {
								fontSize: 16,
								fontWeight: "bolder",
								color: "#2F5F0B"
							}
						}
					},
					data: [
						{ name: "小兴安岭蜜源地", coord: [132.216242, 46.349176], url: "img/temp/honey_img.png", subscribe: "find_honey.html", content: "武夷山四季分明地处中亚热带，武夷山四季气温较均匀、温和湿润，年平均气温约12℃～13℃..." },
						{ name: "长白山蜜源地", coord: [127.742269, 42.515146], url: "img/temp/honey_img.png", subscribe: "find_honey.html", content: "武夷山四季分明地处中亚热带，武夷山四季气温较均匀、温和湿润，年平均气温约12℃～13℃..." },
						{ name: "吕梁山蜜源地", coord: [110.835847, 37.004701], url: "img/temp/honey_img.png", subscribe: "find_honey.html", content: "武夷山四季分明地处中亚热带，武夷山四季气温较均匀、温和湿润，年平均气温约12℃～13℃..." },
						{ name: "太行山蜜源", coord: [114.644087, 38.82287], url: "img/temp/honey_img.png", subscribe: "find_honey.html", content: "武夷山四季分明地处中亚热带，武夷山四季气温较均匀、温和湿润，年平均气温约12℃～13℃..." },
						{ name: "天山蜜源地", coord: [83.920602, 43.182776], url: "img/temp/honey_img.png", subscribe: "find_honey.html", content: "武夷山四季分明地处中亚热带，武夷山四季气温较均匀、温和湿润，年平均气温约12℃～13℃..." },
						{ name: "秦岭蜜源地", coord: [106.54153, 33.907715], url: "img/temp/honey_img.png", subscribe: "find_honey.html", content: "武夷山四季分明地处中亚热带，武夷山四季气温较均匀、温和湿润，年平均气温约12℃～13℃..." },
						{ name: "武陵山蜜源地", coord: [108.059019, 30.359339], url: "img/temp/honey_img.png", subscribe: "find_honey.html", content: "武夷山四季分明地处中亚热带，武夷山四季气温较均匀、温和湿润，年平均气温约12℃～13℃..." },
						{ name: "五指山蜜源地", coord: [109.843557, 19.267705], url: "img/temp/honey_img.png", subscribe: "find_honey.html", content: "武夷山四季分明地处中亚热带，武夷山四季气温较均匀、温和湿润，年平均气温约12℃～13℃..." },
						{ name: "喜马拉雅蜜源地", coord: [98.510822, 28.977569], url: "img/temp/honey_img.png", subscribe: "find_honey.html", content: "武夷山四季分明地处中亚热带，武夷山四季气温较均匀、温和湿润，年平均气温约12℃～13℃..." },
						{ name: "祁连山源地", coord: [100.019401, 38.660663], url: "img/temp/honey_img.png", subscribe: "find_honey.html", content: "武夷山四季分明地处中亚热带，武夷山四季气温较均匀、温和湿润，年平均气温约12℃～13℃..." }
					]
				}
			}]
		});
		window.onresize = function () {
			chart.resize();
		};
	</script>
</body>

</html>